<mat-card class="example-card">
  <mat-card-header>
    <div mat-card-avatar class="example-header-image"></div>
    <mat-card-title>用户名:{{user.name}}<span *ngIf="!user.name" class="unknow">未知</span></mat-card-title>
    <mat-card-subtitle class="flex">
      性别:
      <div [ngClass]="{man:user.sex==1,woman:user.sex==2,unknow:user.sex==0}" [ngSwitch]="user.sex">
        <span *ngSwitchCase="1">男</span>
        <span *ngSwitchCase="2">女</span>
        <span *ngSwitchDefault>未知</span>
      </div>
    </mat-card-subtitle>
    <mat-card-subtitle class="flex">
      生日:{{user.birthDay}}<span *ngIf="!user.birthDay" class="unknow">未知</span>
    </mat-card-subtitle>
    <mat-card-subtitle class="flex">
      能力值:{{user.abilityValue}}
    </mat-card-subtitle>
  </mat-card-header>

  <img style="width:100%" md-card-image src="assets/timg.jpg" alt="image of user">
  <mat-card-content>
    <p>
      备注：{{user.remark}} <span *ngIf="!user.remark" class="unknow">无</span>
    </p>
  </mat-card-content>
  <mat-card-actions>
    <button mat-button color="primary" routerLink="/edit/{{user.id}}">修改</button>
    <button mat-button color="warn" (click)="del()">删除</button>
  </mat-card-actions>
</mat-card>
